<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>练习1</title>
		<script src="./js/myScript.js"></script>
		<script>
			//定义全局变量demo2和demo3
			/*
			这是多行注释
			*/
			var demo2;
			var demo3;
			window.onload=function(){
				demo2=window.document.getElementById("firstp");
				console.log("firstp对象已赋值给demo2");
				var x=1;
				console.log(false||false);
			}
			//显示时间
			function showTime(){
				document.getElementById("firstp").style.visibility="visible";
				document.getElementById("firstp").innerHTML=Date();
				console.log(Date());
			}
			
			//改变<p>中代码
			function changeHtml(){
				var cars = ["BMW", "Volvo", "porsche", "Ford"];
				var i = 0;
				var text = "";
				for (;cars[i];) {
				  text += cars[i] + " ";
				  i++;
				}
				console.log(text);
				var lastname="Bill",lastName="Gates";
				var printAll="change the time " + lastname+ " " + lastName;
				document.getElementById("firstp").innerHTML=printAll;
				console.log("<p>中内容修改为:" + printAll);
			}
			
			function changeCSS(){
				var demo=document.getElementById("firstp");
				if (demo.style.visibility=="visible") {
					demo.style.color="red";
				}
			}
			function changeCSSR(){
				var demo=document.getElementById("firstp");
				demo.style.color="";
				demo.style.fontSize="";
			}
			function changeCSSR2(){
				demo2.style.fontSize="35px";
				console.log("字体大小更改为35px");
			}function changeCSSR1(){
				demo2.style.fontSize="45px";
				console.log("字体大小更改为45px");
			}
			
			function changeCSSR3(){
				demo3.innerHTML="使用的是全局变量demo3插入信息";
			}
			function changeGift(){
				demo3=document.getElementById("firstp");
				alert("demo3获取到firstp对象");
			}
		</script>
	</head>
	<body>
		
		<button onclick="showTime()">显示时间</button>
		<button onclick="changeHtml()">change</button>
		<button onclick="changeCSS()">变为红色</button>
		<button onclick="changeCSSR()">字体还原</button>
		<button onclick="changeCSSR2()">使用全局变量demo2使字体变大</button>
		<button onclick="changeCSSR1()">使用全局变量demo1使字体变大</button>
		<button onclick="changeCSSR3()">使用demo3</button>
		<button onclick="changeGift()">赋值给全局变量demo3</button>
		<button onclick="useMyScript()">使用外部脚本</button>
		<p id="firstp" style="visibility: hidden;"></p>
	</body>
	<script type="text/javascript">
		var demo1=document.getElementById("firstp");
		console.log("在页面加载完成后将firstp赋值给demo1");
	</script>
</html>
